<template>
  <div>
    <CartItem v-for="item in list" :key="item.id" :item="item"> </CartItem>
  </div>
</template>

<script>
import CartItem from './CartItem.vue'
export default {
  props: {
    productionList: {
      type: Array
    },
    cartList: {
      type: Array
    }
  },
  components: {
    CartItem,
  },
  computed: {
    list() {
      return this.cartList.map((item) => {
        const productItem = this.productionList.find((product) => {
          return product.id === item.id
        })
        return {
          ...productItem,
          quantity: item.quantity
        }
      })
    }
  }
}
</script>

<style>
</style>
